import React from 'react';
import './CompletionToast.css';

const CompletionToast = ({ 
  isVisible, 
  message = '计算完成！',
  type = 'success',
  onClose 
}) => {
  if (!isVisible) return null;

  const getIcon = () => {
    switch (type) {
      case 'success':
        return '✅';
      case 'error':
        return '❌';
      case 'warning':
        return '⚠️';
      default:
        return '✅';
    }
  };

  return (
    <div className={`completion-toast ${type} ${isVisible ? 'visible' : ''}`}>
      <div className="toast-content">
        <span className="toast-icon">{getIcon()}</span>
        <span className="toast-message">{message}</span>
        {onClose && (
          <button 
            className="toast-close"
            onClick={onClose}
            title="关闭"
          >
            ✕
          </button>
        )}
      </div>
      <div className="toast-progress-bar"></div>
    </div>
  );
};

export default CompletionToast; 